<template>
  <div>
    <input type="checkbox" :disabled="checkDisabled" v-model="value" @change="change" class="table-select-box" :checkedId="id">
  </div>
</template>

<script>
import emitter from './emitter'
export default {
  mixins: [emitter],
  componentName: 'elTableSelect',
  props: {
    id: Number
  },
  data () {
    return {
      value: false,
      checkDisabled: false
    }
  },
  inject: [
    'table'
  ],
  beforeDestroy () {
    this.dispatch('elTable', 'init')
  },
  created () {
    this.$on('selectActive', (n) => {
      this.value = n
    })
    this.$on('selectAll', (n) => {
      this.value = n
      this.checkDisabled = n
    })
  },
  mounted () {
    if (this.table.selectList && this.table.selectList.includes(this.id)) {
      this.value = true
      this.dispatch('elTable', 'initChangeChecked', { id: this.id })
    }
    if (this.table.isAllSelect) {
      this.value = true
      this.checkDisabled = true
    }
  },
  methods: {
    change () {
      this.dispatch('elTable', 'handChangeChecked', {
        checked: this.value,
        id: this.id
      })
    }
  }
}
</script>
